<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../../dist/js/node_module/angular.js"></script>

<style>
    *{margin:0;padding: 0;}
    ul {
        margin-top: 100px;
        margin-left: 100px;
    }
    ul li{
        float: left;padding: 4px;
        margin: 0% 6px;
        width: 20px;
        height: 20px;
        border: 1px solid #bd2c00;
        color: #000;
        text-align: center;
        line-height: 20px;
        list-style: none;
        font-size: 14px;

    }
    .active{
        background: indianred;
        color: #fff;
    }
    .none{
        display: none;
    }
    .block{
        display: block;
    }
</style>
</head>
<body ng-app="app" ng-controller="ctrl">
<div>{{pageNumList}}</div>

    <ul>
        <li ng-click="top()">《</li>
        <li>1</li>
        <li ng-class="{'block' : ones == true,'none': ones == false}">...</li>
        <li ng-repeat="page in  pages " ng-click="active($index)" ng-class="{'active' : $index == i }"><a>{{page+2}}</a></li>
        <li ng-class="{'block' : lasts == true,'none': lasts == false}">...</li>
        <li >{{lastpate}}</li>
        <li ng-click="next()">》</li>


        <li ng-hide=' $index<min ||$index>=max' ng-repeat='page in totalPage' ng-class="{true: 'current'}[$index==currentPage-1]" click-color ng-click='resPage($index+1)'><a href="javascript:;">{{$index+1}}</a></li>

    </ul>


<script>
    var app = angular.module('app',[]);
    app.controller('ctrl',['$scope','$rootScope', function ($scope,$rootScope) {
        //模拟数据
        var arr = [[1,2,3,4,5],[6,7,8,9,10],[11,12,13,14,15],[16,17,18,19,20],[21,22,23,24,25],[26,27,28,29,30],[31,32,33,34,35],[36,37,38,39,40],
                    ['w','q','e','r'],['a','s','d','z','x']

        ];
        $scope.ones = false;
        $scope.lasts = true;
        $scope.i=1 //是当前页
        $scope.lastpate = arr.length;//总页数

        $scope.pages = [];//页码数组
        function demo(){
            $scope.pages = []
            console.log($scope.i)
            var arr = [];

            if ($scope.i == 1){
                $scope.i=arr.push(1);
                $scope.i=arr.push(2);
                $scope.i=arr.push(3);
                $scope.i=arr.push(4);
                $scope.i=arr.push(5);

            }
            if ($scope.i == 2){
                $scope.i=arr.push(1);
                $scope.i=arr.push(2);
                $scope.i=arr.push(3);
                $scope.i=arr.push(4);
                $scope.i=arr.push(5);
                console.log(2)

            }

            if ($scope.i==3){
                console.log(1)
                $scope.i=arr.push(1);
                $scope.i=arr.push(2);
                $scope.i=arr.push($scope.i+1);
                $scope.i=arr.push(4);
                $scope.i=arr.push(5);
                console.log(3)

            }
            if($scope.i > $scope.lastpate-3){
                $scope.i=arr.push($scope.i-2);

                $scope.i=arr.push($scope.i-1);
                $scope.i=arr.push($scope.i);
                $scope.i=arr.push($scope.lastpate-1);
                $scope.i =arr.push($scope.lastpate);
                console.log(arr,'4');
            }

            return arr;

        }
        $scope.pages = demo();





//        $scope.pageNumList = arr[$scope.i]//当前也都数据

        //下一页
        $scope.next = function(){
            $scope.i ++;
            $scope.pageNumList = arr[$scope.i]
            if ($scope.i < 3){
                $scope.ones = true;

            }else{
                $scope.ones = false
            }
            if ($scope.i > $scope.lastpate-1){
                $scope.lasts = false;

            }else {
                $scope.lasts = true
            }
            $scope.pages = demo();
        };








        //上一页
        $scope.top = function(){
            $scope.i --;
            $scope.pageNumList = arr[$scope.i]


            if ($scope.i < 3){
                $scope.ones = true;

            }else{
                $scope.ones = false
            }
            if ($scope.i > $scope.lastpate-1){
                $scope.lasts = false;

            }else {
                $scope.lasts = true
            }
        };




        //当前点击
        $scope.active = function(index){
            console.log(this)
            $scope.i =index;
            $scope.pageNumList = arr[$scope.i];
            if ($scope.i < 3){
                $scope.ones = true;
                $scope.lasts = false;

            }else{
                $scope.ones = false
                $scope.lasts = true;

            }

            }









    }])




</script>


</body>
</html>